<template>
	<view class="page">
		<view class="tip" style=" box-sizing: border-box;">
			<text
				style="color: red; margin-right: 8rpx;font-size: 28rpx;">*</text><text>请上传<text style="color: red;">车辆合格证照片</text></text>
		</view>
		<chehefile ref="chehefile"></chehefile>
		<view class="tip" style=" box-sizing: border-box;">
			<text
				style="color: red; margin-top: 15rpx; margin-right: 8rpx;font-size: 28rpx;">*</text><text>请上传<text style="color: red;">购车发票照片</text></text>
		</view>
		<gouchefapiaofile ref="gouchefapiaofile"></gouchefapiaofile>
		<view class="tip" style="box-sizing: border-box;">
			<text
				style="color: red; margin-top: 15rpx; margin-right: 8rpx;font-size: 28rpx;">*</text><text>请上传<text style="color: red;">交强险保单PDF文件</text></text>
		</view>
		<qiangxianfile ref="qiangxianfile"></qiangxianfile>
		<view class="tip" style="box-sizing: border-box;">
			<text
				style="color: red; margin-top: 15rpx; margin-right: 8rpx;font-size: 28rpx;">*</text><text>请上传<text style="color: red;">盗抢险保单PDF文件</text></text>
		</view>
		<daoqiangfile ref="daoqiangfile"></daoqiangfile>
		<u-button
			:customStyle="{border:'none',background: '#0079FE',width:'686rpx',marginTop:'30px',color:'#fff',height:'90rpx',fontSize:'30rpx',borderRadius:'15rpx'}"
			@click="submit">提交
		</u-button>
	</view>
</template>

<script>
	import chehefile from "./com/che_liang_he_ge_file.vue";
	import gouchefapiaofile from "./com/gou_che_fa_piao.vue";
	import qiangxianfile from "./com/qiang_xian_file.vue";
	import daoqiangfile from "./com/dao_qiang_xian_file.vue";
	export default {
		components:{
			chehefile,
			gouchefapiaofile,
			qiangxianfile,
			daoqiangfile
		},
		data() {
			return {
				form:{
					id:null,
					vqc:'',//车辆合格证
					cpi:'',//购车发票
					ctippdf:'',//交强险
					tarppdf:'',//盗抢险
				}
			}
		},
		onLoad:function(options) {
			this.form.id = options.id
		},
		methods:{
			// 提交
			submit() {
				console.log(this.form, 'this.$refs.shouruliu.fileList1');
				if (this.$refs.chehefile.fileList1.length <= 0) {
					this.$ToastFail('请先上传车辆合格证文件再提交')
					return
				}
				if (this.$refs.gouchefapiaofile.fileList1.length <= 0) {
					this.$ToastFail('请先上传购车发票文件再提交')
					return
				}
				if (this.$refs.qiangxianfile.fileList1.length <= 0) {
					this.$ToastFail('请先上传交强险保单PDF文件再提交')
					return
				}
				if (this.$refs.daoqiangfile.fileList1.length <= 0) {
					this.$ToastFail('请先上传盗抢险保单PDF文件再提交')
					return
				}
				var arr1 = this.$refs.chehefile.fileList1.map(d => {
					return d.url
				})
				var arr2 = this.$refs.gouchefapiaofile.fileList1.map(d => {
					return d.url
				}) 
				var arr3 = this.$refs.qiangxianfile.fileList1.map(d => {
					return d.url
				}) 
				var arr4 = this.$refs.daoqiangfile.fileList1.map(d => {
					return d.url
				})
			
				this.form.vqc = arr1.join(',')
				this.form.cpi = arr2.join(',')
				this.form.ctippdf = arr3.join(',')
				this.form.tarppdf = arr4.join(',')
				uni.showModal({
					title: '提示',
					// 提示文字
					content: '您确认要提交吗？',
					// 取消按钮的文字自定义
					cancelText: "取消",
					// showCancel: false,
					// 确认按钮的文字自定义
					confirmText: "确认",
					//删除字体的颜色，颜色最好是十六进制，不然程序发布上线会出问题
					confirmColor: '#ef111b',
					//取消字体的颜色
					cancelColor: '#000000',
					success: function(res) {
						//变量接this
						var that = this
						if (res.confirm) {
							// 执行确认后的操作
							that.submitApi()
						} else {
							// 执行取消后的操作
						}
					}.bind(this)
				})
			},
			async submitApi() {
				
			
				// 请求接口
				uni.showLoading({
					mask: true
				})
				const res = await this.$post(`/biz/installment/archiving`, this.form)
				if (res.statusCode == 200) {
					this.$ToastOk('提交成功')
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/xiao_shou_duan/wo_de_ding_dan'
						})
					}, 1000)
				} else {
					this.$ToastFail("提交失败,请重试")
				}
			}
		}
	}
</script>

<style>
	.page {
		width: 100%;
		/* height: 100vh; */
		overflow-y: auto;
		padding: 0 30rpx 40rpx;
		box-sizing: border-box;
	}
	.tip {
		display: flex;
		align-items: center;
		font-size: 24rpx;
		font-family: 'PingFang SC-Regular, PingFang SC';
		font-weight: 400;
		color: #B1B1B1;
		/* margin-top: 24rpx; */
		margin: 21rpx 0 23rpx;
	}
</style>